{extend name="common/main"}

{block name="css"}
<link rel="stylesheet" href="/static/assets/css/bootstrap.min.css" />
<style>
    .lai{
        float: none;
        display:inline-block;
    }
</style>
{/block}

{block name="body"}
<body data-type="widgets">
{include file="common/index"}
<div class="tpl-content-wrapper">
    <div class="row-content am-cf">
        <div class="row">
            <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                <!--<h3>点数转让</h3>-->
                <div class="widget am-cf">
                    <div class="widget-head am-cf">
                        <div class="widget-title  am-cf">点卡生成</div>
                    </div>
                    <div class="widget-body am-fr">

                        <form class="am-form tpl-form-border-form tpl-form-border-br " id="form">
                            <div class="am-form-group">
                                <label for="user-weibo" class="am-u-sm-2">选择充值卡类型: </label>
                                <div class="am-u-sm-3 lai" >
                                    <label> <input type="radio" class="tpl-form-input" value="0" name="state" checked="checked">月卡(30)</label>
                                    <label> <input type="radio" class="tpl-form-input" value="1" name="state">季卡(90)</label>
                                    <label> <input type="radio" class="tpl-form-input" value="2" name="state">年卡(365)</label>
                                </div>

                            </div>
                            <div class="am-form-group">
                                <label for="user-weibo" class="am-u-sm-2">选择充值卡类型: </label>

                                <!--<label for="user-weibo" class="am-u-sm-2">数量: </label>-->
                                <div class="am-u-sm-3 lai" id="lai">
                                    <input type="number" id="user-weibo" name="num" placeholder="输入生成数量">
                                </div>
                                <button type="button" onclick="roleSubmit()" class="am-btn am-btn-primary am-radius" style=" padding: .3em 1em;">确定</button>

                            </div>


                        </form>
                    </div>
                </div>
            </div>

        </div>
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12" >

            <div class="widget am-cf">
                <form id="searchform" action=""  method="get" class="am-form tpl-form-border-form tpl-form-border-br">
                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-1">
                        <div class="am-form-group tpl-table-list-select">
                            <select  name="type" >
                                <option value="-1">类型</option>
                                <option value="0" {if $Request.get.type=='0'}selected="selected"{/if}>月卡</option>
                                <option value="1" {if $Request.get.type=='1'}selected="selected"{/if}>季卡</option>
                                <option value="2" {if $Request.get.type=='2'}selected="selected"{/if}>年卡</option>
                            </select>
                        </div>
                    </div>
                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-1">
                        <div class="am-form-group tpl-table-list-select">
                            <select  name="display" >
                                <option value="-1" >是否使用</option>
                                <option value="0" {if $Request.get.display=='0'}selected="selected"{/if}>未使用</option>
                                <option value="1" {if $Request.get.display=='1'}selected="selected"{/if}>已用</option>
                            </select>
                        </div>
                    </div>


                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-2" style="float: left;">
                        <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p">
                                        <span class="am-input-group-btn">
                                            <button class="am-btn am-btn-primary am-radius" type="submit" >搜索</button>
                                        </span>
                        </div>
                    </div>

                </form>

                <button type="button" onclick="fulldel()" class="am-btn am-btn-primary am-radius we clor" id="zhuan">批量删除</button>
                <button type="button" onclick="exc_button()" data-toggle="tooltip" title="" class="am-btn am-btn-primary am-radius ad clor">导出Excel</button>

                <div class="widget-body  am-fr">
                    <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black " id="example-r1">
                        <thead>
                        <tr>
                            <th><input type="checkbox" id="chkClkDevices" ></th>
                            <th>卡号</th>
                            <th>密码</th>
                            <th>类型</th>
                            <th>是否使用</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        {foreach name="card" key="key" item="v"}
                        <tr class="gradeX">
                            <td><input type="checkbox" name="id" class="id" value="{$v.id}"></td>
                            <td>{$v.name}</td>
                            <td>{$v.pass}</td>
                            <td>{if $v.type==0}月卡{elseif $v.type==1}季卡{else}年卡{/if}</td>
                            <td>{if $v.display==0}未使用{elseif $v.display==1}已用{/if}</td>

                            <td>
                                <div class="tpl-table-black-operation">
                                    <button type="button" onclick="del({$v.id})" style="color: #e7505a;background-color: white;padding: 5px 6px;font-size: 12px;line-height: 12px;border: 1px solid #e7505a;" class="tpl-table-black-operation-del " data-am-modal="{target: '#doc-modal-1', closeViaDimmer: 0, width: 400, height: 225}">删除</button>
                                </div>
                            </td>
                        </tr>
                        {/foreach}
                        </tbody>
                    </table>
                    <div class="am-u-lg-10 am-cf">
                        <div class="am-fr">
                            <ul class="am-pagination tpl-pagination">
                                {$card->render()}
                            </ul>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>

</div>
</div>
</body>
{/block}

{block name="js"}
<script type="text/javascript">
    $(function () {
        $('.button_jc').click(function () {
            $inpu=$(this).siblings('#lai').find('input').val();

            $.post("{:url('detection')}", {user_name:$inpu}, function(ret){
                if(ret.code != 200){
                    layer.msg(ret.msg, {icon: 2});
                    return false;
                }
                $('#user_name').val(ret.data);

            });
        })
        //全选，全不选
        $("#chkClkDevices").change(function () {
            $a= $(this).is(':checked');
            if ($a) {
                $("input[type='checkbox']").prop("checked",'checked');
            }else {
                $("input[type='checkbox']").prop("checked", false);
            }

        })
    });
    //提交
    function roleSubmit(){
        var form=document.getElementById("form");
        var formData=new FormData(form);
        $.ajax({
            url:"{:Url('add_generate')}",
            type:'POST',
            data:formData,
            async: false,
            cache: false,
            contentType: false, //不设置内容类型
            processData: false, //不处理数据
            success:function(res){
                if (res.code != 200) {
                    layer.msg(res.msg, {shade: 0.5, time: 2000,icon: 2});
                    return false;
                }
                layer.msg(res.msg, {shade: 0.5, time: 2000, icon: 1}, function(){
                    window.location.reload();

                });
            }
        });
    }
    function sub_butt(t) {
        $sum=$('#weibo').val();//转让点数

        $.post("{:url('presenter')}", {user_name:$sum}, function(ret){
            if(ret.code != 200){
                layer.msg(ret.msg, {icon: 2});
                return false;
            }
            //成功
            // $('#user_name').val(ret.data);

        });
    }
    //导出
    function exc_button() {
        $type= $("[name='type']").val();
        $display=$("[name='display']").val();

        window.location.replace("{:url('export')}?type="+$type+"&display="+$display);

    }
    // 删除按钮
    function del(id) {
        layer.confirm("确定删除？", {btn: ["确定","取消"], shade: 0.5}, function(){
            // 删除权限组
            $.post("{:url('del')}", {id: id}, function(res) {
                if (res.code !=200) {
                    layer.msg(res.msg, {shade: 0.5, time: 1000, icon: 2});
                    return false;
                }

                layer.msg(res.msg, {shade: 0.5, time: 800, icon: 1}, function() {
                    location.reload();
                });
            });
        }, function () {});
    }

    //全选
    $('#chkClkDevices').on("click",function(){
        var xz = $(this).prop("checked");//判断全选按钮的选中状态
        var ck = $('.id').prop("checked",xz); //让class名为qx的选项的选中状态和全选按钮的选中状态一致。
    });

    function fulldel() {
        if($('input[name="id"]:checked').val()==null){
            layer.msg('请先选择要删除的内容', {shade: 0.5, time: 1000, icon: 2});
            return false;
        }else{
            layer.confirm("确定删除？", {btn: ["确定","取消"], shade: 0.5}, function(){
                var chk_value = [];
                $('input[name="id"]:checked').each(function () {
                    chk_value.push($(this).val())
                })
                $arr = chk_value;
                $.post("{:url('fulldel')}", {id: $arr}, function(res) {
                    if (res.code !=200) {
                        layer.msg(res.msg, {shade: 0.5, time: 1000, icon: 2});
                        return false;
                    }

                    layer.msg(res.msg, {shade: 0.5, time: 800, icon: 1}, function() {
                        location.reload();
                    });
                });
            } , function () {
                window.location.reload();
            });
        }
    }

</script>
{/block}